<template>
  <div>编程式导航!===tab
    <ul>
      <li @click='btn(index)' v-for="(item, index) in 3"   :key="index">第{{index+1}}个li</li>
    </ul>

    <router-view></router-view>
  </div>
</template>
           
<script>
export default {
  methods:{
    btn(index){
      if(index==0){
        this.$router.push({path:'/tab/third',query:{
          id:'3333'
        }})
      }else{
        this.$router.push({name:'/tab/forth',params:{
          id:44444
        }})
      }
    }
  }
};
</script>
<style scoped lang='less'>
ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  justify-content: space-around;

  li {
    height: 30px;
    line-height: 30px;
    &:nth-child(1) {
      background-color: red;
      flex: 1;
    }
    &:nth-child(2) {
      background-color: green;
      flex: 1;
    }
    &:nth-child(3) {
      background-color: blue;
      flex: 1;
    }
  }
}
</style>